<template>
  <el-button :loading="props.loading" @click="handleClickReset">
    <slot></slot>
  </el-button>
</template>

<script setup lang="ts">
import { PropType } from 'vue';
import type { ElForm } from 'element-plus';

const props = defineProps({
  loading: {
    type: Boolean,
    default: false
  },

  // dom ref
  formEl: {
    type: Object as PropType<InstanceType<typeof ElForm> | undefined>
  }
});

const emits = defineEmits(['clear']);

// btn - reset
const handleClickReset = () => {
  if (!props.formEl) return;
  props.formEl.resetFields();
  emits('clear');
};
</script>

<style lang="scss" scoped></style>
